---
title: Jupyter Notebooks
---

<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="description" content="My open notebook">
    <title>{{ page.title }}</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv = "X-UA-Compatible" content = "IE = edge">
      <!--[if lt IE 9]>
      <script src = "https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src = "https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
      <![endif]-->
    <meta name="subtitle" content="{{ page.subtitle }}">
    {% if site.author.OtherName %}
    <meta name="author" content="{{site.author.name}} | {{site.author.OtherName}}">
    {% else %}
    <meta name="author" content="{{site.author.name}}">
    {% endif %}

    {% include metadata.html %}
    <!-- Le styles -->
    <!-- Le styles -->
    <link rel="stylesheet" media="screen" href="https://fontlibrary.org/face/quattrocento-sans" type="text/css"/>
    <link rel="stylesheet" media="screen" href="https://fontlibrary.org/face/rosario" type="text/css"/>
    <!-- Bootstrap -->
    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css">
    <link href = "{{ site.baseurl }}/assets/css/bootstrap.min.css" rel = "stylesheet">
    <!-- Self-defined style -->
    <link rel="stylesheet" type="text/css" href="{{ site.baseurl }}/assets/css/style.css">

    {% include analytics.html %}

    <!-- Help the browser identify the RSS feed automatically -->
    <link rel="alternate" type="application/rss+xml" title="Xiaodong Qi's Website" href="{{ site.baseurl }}/atom.xml" />

    <!-- favicon -->
    <link rel="apple-touch-icon" sizes="57x57" href="{{ site.baseurl }}/assets/img/favicon/apple-icon-57x57.png">
    <link rel="apple-touch-icon" sizes="60x60" href="{{ site.baseurl }}/assets/img/favicon/apple-icon-60x60.png">
    <link rel="apple-touch-icon" sizes="72x72" href="{{ site.baseurl }}/assets/img/favicon/apple-icon-72x72.png">
    <link rel="apple-touch-icon" sizes="76x76" href="{{ site.baseurl }}/assets/img/favicon/apple-icon-76x76.png">
    <link rel="apple-touch-icon" sizes="114x114" href="{{ site.baseurl }}/assets/img/favicon/apple-icon-114x114.png">
    <link rel="apple-touch-icon" sizes="120x120" href="{{ site.baseurl }}/assets/img/favicon/apple-icon-120x120.png">
    <link rel="apple-touch-icon" sizes="144x144" href="{{ site.baseurl }}/assets/img/favicon/apple-icon-144x144.png">
    <link rel="apple-touch-icon" sizes="152x152" href="{{ site.baseurl }}/assets/img/favicon/apple-icon-152x152.png">
    <link rel="apple-touch-icon" sizes="180x180" href="{{ site.baseurl }}/assets/img/favicon/apple-icon-180x180.png">
    <link rel="icon" type="image/png" sizes="192x192"  href="{{ site.baseurl }}/assets/img/favicon/android-icon-192x192.png">
    <link rel="icon" type="image/png" sizes="32x32" href="{{ site.baseurl }}/assets/img/favicon/favicon-32x32.png">
    <link rel="icon" type="image/png" sizes="96x96" href="{{ site.baseurl }}/assets/img/favicon/favicon-96x96.png">
    <link rel="icon" type="image/png" sizes="16x16" href="{{ site.baseurl }}/assets/img/favicon/favicon-16x16.png">
    <link rel="manifest" href="{{ site.baseurl }}/assets/img/favicon/manifest.json">
    <meta name="msapplication-TileColor" content="#ffffff">
    <meta name="msapplication-TileImage" content="{{ site.baseurl }}/assets/img/favicon/ms-icon-144x144.png">
    <meta name="theme-color" content="#ffffff">

    <!-- Le javascript -->
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js" ></script>
    <script type="text/javascript" src="{{ site.baseurl }}/assets/js/strftime.js"></script>
    <script type="text/javascript">
    (function ($, undefined) {
        var userName = "{{site.author.github}}";//ketch

        $.getJSON("https://api.github.com/users/" + userName + "/gists?per_page=100&callback=?", function (result) {

            var gists = result.data;  // list of my repos from Github in JSON format
            //var gists = result;  // list of my repos from Github in JSON format

            $.each(gists, function (i, gist) { //loop over all gists
                var f = gist.files[Object.keys(gist.files)[0]]
                if (f.filename.split('.')[1] === 'ipynb') { // Only include notebooks
                    var $item = $("<div>").addClass("gist filterable ");
                    var urlList = gist.html_url.split('/');
                    var gist_hash = urlList[urlList.length-1];
                    var $link = $("<a>").attr("href", "http://nbviewer.ipython.org/" + gist_hash).appendTo($item);
                    $.each(gist.files, function(j, f){
                        //$link.append(f.filename.split('.')[0]);
                        $link.append($("<name>").text(f.filename.split('.')[0]));
                    });
                    if (gist.description != null) {
                        var desc = gist.description.split(/\s+/g);  //unfortunately destroys newlines
                        var tags = [];
                        var rest = [];
                        $.each(desc, function(j, word){
                            if (word[0] === "#") {
                                tags.push(word);
                            }
                            else {
                                rest.push(word);
                            };
                        });
                        $item.append($("<p>").text(rest.join(' ')));
                        $.each(tags, function(j, tag){
                            $item.append($("<tag>").text(tag));
                        });
                    };
                    //console.log($item.html());
                    $item.appendTo("#FilteredSet");
                };

            });
        });
    })(jQuery); // so $ means jQuery in the function above.

    </script>
  </head>
  <!-- Go to www.addthis.com/dashboard to customize your tools -->
  <script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid={{site.addthis.pubid}}" async="async"></script>

  <body>

  {% include navbar.html %}



<div class="container"> <!-- Twitter bootstrap has all body content in a container -->
<header class="jumbotron subhead">
    <h1 class="entry-title">{{ page.title }}</h1>
    <p>{{ page.subtitle }}</p>
</header>

This is a searchable list of all my gisted Jupyter notebooks.  It may take a moment to load
from Github.  The links take you directly to nbviewer.

<div class="controls" id="Filters">
      <h4>Search by title:</h4><input type="text" id="input" placeholder="search" >
</div>

<div id="FilteredSet" class="container"></div>

  <div class="gap"></div>
  <div class="gap"></div>


{% include footer.html %}
